﻿@addTagHelper "*, ZKCloud.Utils"
@model ZKCloud.Web.Apps.CMS.Article.src.ViewModels.AdminArticleListViewModel
@{
    ViewData["Title"] = "文章管理";
}


<div class="page-container admin-page-container">
    <div class="portlet light">
        <div class="portlet-title">
            <div class="caption"><i class="fa fa-user-secret"></i><span class="caption-subject">@ViewData["Title"]</span></div>
            <div ajax-table="#AdminList" class="actions search-bar ajax-table-search-bar">
                <div class="btn-group">
                    <a data-toggle="dropdown" aria-expanded="true" class="btn btn-default btn-circle">
                        <i class="fa fa-angle-down"></i>
                    </a>
                    <ul ajax-table="#AdminList" class="dropdown-menu pull-right ajax-table-menu">
                        <li><a class="refresh"><i class="fa fa-refresh"></i>刷新</a></li>
                        <li><a class="fullscreen"><i class="fa fa-arrows-alt"></i>全屏</a></li>
                        <li class="divider"></li>
                        <li class="dropdown-submenu">
                            <a><i class=""></i>操作</a>
                            <ul class="dropdown-menu pull-right">
                                <li><a class="unimplemented"><i class="fa fa-file-excel-o"></i>导出到表格</a></li>
                                <li><a class="unimplemented"><i class="fa fa-print"></i>打印</a></li>
                            </ul>
                        </li>
                        <li class="dropdown-submenu">
                            <a><i class=""></i>分页设置</a>
                            <ul class="dropdown-menu pull-right">
                                <li><a data-size="5" class="set-page-size"><i class="fa fa-list"></i>每页5条</a> </li>
                                <li><a data-size="25" class="set-page-size"><i class="fa fa-list"></i>每页25条</a></li>
                                <li><a data-size="5" class="set-page-size"><i class="fa fa-list"></i>每页50条</a> </li>
                                <li><a data-size="25" class="set-page-size"><i class="fa fa-list"></i>每页100条</a></li>
                            </ul>
                        </li>
                        <li class="divider"></li>
                        <li><a onclick="$(this).closestAjaxTable().toggleRecycleBin(this)"><i class="fa fa-recycle"></i>回收站</a></li>
                        <li>
                            <a onclick="
                               var table=$(this).closestAjaxTable();
                               table.showRemoteModalForRow(null, &quot;添加管理员&quot;, &quot;/admin/admins/add&quot;, null);"><i class="fa fa-plus"></i>添加管理员</a>
                        </li>

                    </ul>
                </div>
                <div class="portlet-input input-inline input-medium">
                    <div class="input-group">
                        <input type="text" placeholder="用户名" class="form-control keyword">
                        <div class="input-group-btn">
                            <a class="btn btn-default search-button">
                                <i class="fa fa-search"></i>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="portlet-body">
            <div data-target="#AdminListMenu" data-toggle="context" ajax-table-template="" ajax-table-target="/admin/admins/search" class="ajax-table" id="AdminList">
                <div class="table-container inbox-content">
                    <div class="row">
                        <div class="col-md-12 col-sm-12">
                            <div class="pagination-panel pull-right">
                                <a class="btn btn-sm blue to-first disabled"><i class="fa fa-angle-double-left"></i></a>
                                <a class="btn btn-sm blue to-prev disabled"><i class="fa fa-angle-left"></i></a>
                                <input type="text" class="pagination-panel-input form-control input-sm">
                                <a class="btn btn-sm blue to-next disabled"><i class="fa fa-angle-right"></i></a>
                                <a class="btn btn-sm blue to-last disabled"><i class="fa fa-angle-double-right"></i></a>
                            </div>
                        </div>
                    </div>
                    <div class="table-scroller">
                        <table class="table table-striped table-hover dataTable">
                            <thead>
                                <tr class="heading" role="row">
                                    <th width="2%">
                                        <div class="btn-group">
                                            <a aria-expanded="false" class="btn btn-sm blue dropdown-toggle" data-toggle="dropdown"> <i class="fa fa-angle-down"></i></a>
                                            <ul class="dropdown-menu">
                                                <li><a onclick="$(this).closestAjaxTable().selectOrUnselectAll()"><i class="fa fa-check-square-o"></i>全选/取消全选</a></li>
                                                <li class="divider"></li>
                                                <li>
                                                    <a onclick="
                                                       var table=$(this).closestAjaxTable();
                                                       var rows=table.getMultiCheckedRowsData();
                                                       if (!rows.length) {
                                                       $.toast(&quot;请选择需要删除的管理员&quot;);
                                                       } else {
                                                       table.showConfirmActionForRows(rows, &quot;确认&quot;, &quot;取消&quot;, &quot;批量删除&quot;, &quot;确认删除以下管理员？&lt;%_.each(rows, function(row) { print('&lt;br /&gt;' + _.escape(row.ToString)); })%&gt;&quot;, function(result) { result &amp;&amp; table.postAction(_.map(rows, function(row) { return row.Id; }), &quot;/admin/admins/batch?action=delete&quot;); }, {&quot;type&quot;:&quot;type-danger&quot;});
                                                    }"><i class="fa fa-recycle"></i>批量删除</a>
                                                </li>
                                            </ul>
                                        </div>
                                    </th>
                                    <td>文章标题</td>
                                    <td>作者</td>
                                    <td>文章摘要</td>
                                    <td>文章来源</td>
                                    <td>浏览次数</td>
                                    <td>创建时间</td>
                                    <td>更新时间</td>
                                    <th width="10%">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                @{  foreach (var item in Model.Articles)
                                    {
                                    <tr>
                                        <td>
                                            <div class="checker">
                                                <span>
                                                    <input type="checkbox" value="4">
                                                </span>
                                            </div>
                                        </td>
                                        <td>@item.Title</td>
                                        <td>@item.UserId</td>
                                        <td>@item.Summary</td>
                                        <td>@item.Source</td>
                                        <td>@item.ViewCount</td>
                                        <td>@item.CreateTime</td>
                                        <td>@item.LastUpdated</td>
                                        <td>
                                            <a onclick="viewArticle(@item.Id)">查看</a>
                                            <a onclick="editArticle(@item.Id)">编辑</a>
                                            <a onclick="deleteArticle(@item.Id)">删除</a>
                                        </td>
                                    </tr>}
                                }
                            </tbody>
                        </table>
                        <div>
                            <cs-pager cs-paging-info="@Model.Paging"
                                      cs-pagenumber-param="pageNumber"
                                      asp-controller="Article"
                                      asp-action="AdminList"
                                      asp-route-query="@Model.Query"
                                      asp-route-pagesize="@Model.Paging.ItemsPerPage"></cs-pager>
                        </div>
                    </div>
                </div>
            </div>


            <div ajax-table="#AdminList" class="ajax-table-menu" id="AdminListMenu">
                <ul role="menu" class="dropdown-menu">

                    <li><a class="refresh"><i class="fa fa-refresh"></i>刷新</a></li>

                    <li><a class="fullscreen"><i class="fa fa-arrows-alt"></i>全屏</a></li>

                    <li class="divider"></li>

                    <li>
                        <a onclick="
                           var table=$(this).closestAjaxTable();
                           var row=table.getSingleSelectedRowData();
                           row &amp;&amp; table.showRemoteModalForRow(row, &quot;编辑管理员&quot;, &quot;/admin/admins/edit?id=&lt;%-row.Id%&gt;&quot;, null);"><i class="fa fa-edit"></i>查看</a>
                    </li>

                    <li>
                        <a onclick="
                           var table=$(this).closestAjaxTable();
                           table.showRemoteModalForRow(null, &quot;添加管理员&quot;, &quot;/admin/admins/add&quot;, null);"><i class="fa fa-plus"></i>添加管理员</a>
                    </li>

                </ul>
            </div>

        </div>
    </div><!--portlet-->
</div>



